<template>
  <div id="enum_list">
    <div id="mainBox">
      <div id="boxTit">
        <span class="tit">枚举列表</span>
        <i
          class="el-icon-circle-plus-outline"
          @click="appends"
        />
      </div>
      <el-table
        :data="tableData"
        border
        style="width: auto"
      >
        <el-table-column
          label="选择"
          type="selection"
          width="30"
        />
        <el-table-column
          prop="name"
          label="枚举名称"
          width="120"
        />
        <el-table-column
          prop="enumViewer"
          label="枚举描述"
          width="120"
        />
        <el-table-column label="操作">
          <template slot-scope="scope">
            <el-button
              type="text"
              size="small"
              @click="handleClick(scope.row.id)"
            >查看枚举详情</el-button>
            <el-button
              type="text"
              size="small"
              @click="handleDelete(scope.row.id)"
            >删除枚举</el-button>
          </template>

        </el-table-column>

      </el-table>
      <!-- <el-pagination
        small
        layout="prev, pager, next"
        @prev-click="prePage"
        @next-click="nextPage"
        @current-change="currentChange"
        :page-size="10"
        :total="total"
      >
      </el-pagination> -->
    </div>
  </div>
</template>
<script>
import { enumList, enumDel } from '@/api/page'
import { VueEditor } from 'vue2-editor'
export default {
  components: {
    VueEditor
  },
  data() {
    return {
      tableData: []
    }
  },
  mounted() {
    this.init()
  },
  methods: {
    appends() {
      this.$router.push('/enum/save')
    },
    handleClick(a) {
      localStorage.setItem('enumid', a)
      this.$router.push('/enum/desc')
    },
    handleDelete(a) {
      var data = {}
      data.id = a
      enumDel(data).then(response => {
        console.log('success')
        this.init()
      })
    },
    init() {
      var data = {
        current: 1,
        size: 10,
        condition: {
          pid: localStorage.getItem('pid')
        }
      }
      enumList(data).then(response => {
        this.tableData = response.data.data.records
      })
    }
  }
}
</script>
<style>
#enum_list .el-input {
  width: 120px;
}
#enum_list {
  margin-top: 20px;
  margin-left: 20px;
}
#enum_list #mainBox {
  width: 99%;
  border: 1px solid #623f18;
}
#enum_list #mainBox #boxTit {
  height: 40px;
  width: 100%;
  background: #623f18;
}
#enum_list #mainBox #boxTit i {
  cursor: pointer;
  float: right;
  line-height: 40px;
  margin-right: 10px;
  font-size: 25px;
  color: #fff;
}
#enum_list #mainBox #boxTit .tit {
  margin-left: 20px;
  font-size: 20px;
  color: #fff;
  line-height: 40px;
  float: left;
}
#enum_list .el-table {
  margin: 20px;
}
</style>
